<docs>
  <docs-title>  横向柱状图 </docs-title>
  <docs-desc> 公共配置：xAxis、yAxis、series </docs-desc>
 </docs>

<script>
import chart from "../echart.vue";

export default {
  extends: chart,
  data() {
    return {
      commonOptions: null
    };
  },
  created() {
    this.initCommonOptions();
  },
  methods: {
    initCommonOptions() {
      this.commonOptions = {
        xAxis: {
          show: false
        },
        yAxis: [
          {
            type: "category",
            axisLine: {
              show: false
            },
            axisTick: {
              show: false
            },
            inverse: true, // data 排序
            data: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"]
          },
          {
            type: "category",
            axisLine: {
              show: false
            },
            axisTick: {
              show: false
            },
            axisLabel: {
              color: "#000"
            },
            inverse: true, // data 排序 与上一个保持一致
            data: [150, 230, 224, 218, 135, 147, 260]
          }
        ],
        series: [
          {
            type: "bar",
            barWidth: 14,
            showBackground: true,
            backgroundStyle: {
              color: "rgba(165, 165, 165, 0.2)"
            },
            data: [150, 230, 224, 218, 135, 147, 260]
          }
        ]
      };
    }
  }
};
</script>
